<template>
  <div class="xq-form-wrapper page-miH page-bgBack" style="padding: 24px">
    <a-tabs v-model="tabsKey" @change="tabsChange" :defaultValue="tabsKey">
      <a-tab-pane key="3" tab="待定薪档案">
        <div style="display: flex; justify-content: space-between; align-items: center">
          <div>
            <a-input-search
              allow-clear
              class="mr12"
              placeholder="姓名/手机号/身份证号"
              style="width: 180px"
              @search="inputChange2"
              :defaultValue="nameOrPhone2"
            />
            <a-select
              v-model="postTypeCheck"
              allowClear
              placeholder="工作性质"
              :defaultValue="postTypeCheck"
              :options="postTypeLst"
              class="mr12"
              style="width: 180px"
              @change="selectCheck2"
            />
            <a-select
              style="width: 180px"
              class="mr12"
              :append-to-body="false"
              @change="handleChange2"
              allowClear
              placeholder="员工状态"
              :defaultValue="empStatus2"
            >
              <a-select-option value="1"> 待入职 </a-select-option>
              <a-select-option value="2"> 在职 </a-select-option>
              <a-select-option value="3"> 待离职 </a-select-option>
              <a-select-option value="4"> 离职 </a-select-option>
            </a-select>
            <a-select
              allowClear
              show-search
              option-filter-prop="children"
              :filter-option="filterOption"
              v-model="channelId2"
              placeholder="请选择渠道"
              @change="selectCheckChannel"
              style="width: 225px"
              :defaultValue="channelId2"
            >
              <a-select-option v-model="item.id" v-for="(item, index) in Channels" :key="index">
                {{ item.name }}
              </a-select-option>
            </a-select>
          </div>
          <div>
            <a-button type="primary" @click="isChooseStaff = true">批量定薪</a-button>
          </div>
        </div>
        <employee-select
          :show.sync="isChooseStaff"
          :default-selected-keys="selectedRowKeys3"
          :selected-list.sync="selectedRowKeys3"
          @change="goDetail2"
          :status="4"
        />
        <div class="tableBox">
          <a-table
            :scroll="{ x: 1200 }"
            row-key="id"
            :columns="columns3"
            :data-source="notWageList"
            :pagination="pagination2"
            @change="handleTableChange2"
          >
            <a slot="name" style="position: relative; cursor: default" slot-scope="text, record">
              <img
                :src="abolitionImg"
                v-if="record.status === 4"
                style="position: absolute; top: -16px; left: -15px; width: 40px; height: 40px"
              />
              <img
                :src="abolitionImg2"
                v-if="record.status === 1"
                style="position: absolute; top: -16px; left: -15px; width: 40px; height: 40px"
              />
              <p style="margin-bottom: 0; color: #595959">
                {{ text }}
              </p>
            </a>
            <span slot="channelVO" slot-scope="text">
              {{ text && text.name ? text.name : "--" }}
            </span>
            <span slot="workHour" slot-scope="text, record">
              {{ record.workHour }}
            </span>
            <span slot="joinDate" slot-scope="text">
              {{ moment(text).format("YYYY-MM-DD") }}
            </span>
            <span slot="postType" slot-scope="text">
              {{ postTypeArr[text - 1] }}
            </span>
            <a slot="action" slot-scope="text, record" @click="goDetail(record, 1)"> 定薪 </a>
          </a-table>
        </div>
      </a-tab-pane>
      <a-tab-pane key="1" tab="固定薪资档案">
        <employee-select
          :show.sync="isChooseStaff2"
          :default-selected-keys="selectedRowKeys4"
          :selected-list.sync="selectedRowKeys4"
          @change="batchEdit(1)"
          :status="6"
        />
        <div class="xq-form-search" style="margin-top: 10px">
          <div style="display: flex; justify-content: space-between">
            <XqFormBuild
              ref="searchForm"
              mode="search"
              :data-source="{}"
              :dynamic-data="dynamicData"
              :form-fields="FormJson['fields']"
              :form-validators="FormJson['validators']"
              :form-config="FormJson['config']['search']"
              @search="filterRecord"
              :searchSpan="8"
            />
            <div class="xq-form-action" style="display: flex; justify-content: flex-end; margin-left: 20px">
              <a-space class="xq-form-action-left">
                <a-button v-if="selectedRowKeys.length" type="default" @click="batch" style="margin-right: 12px"> 批量定薪 </a-button>
                <a-button type="default" @click="isChooseStaff2 = true" style="margin-right: 12px"> 批量调薪 </a-button>
                <a-button type="default" style="margin-right: 12px" @click="goUpload"> 导入定薪 </a-button>
                <a-button type="default" style="margin-right: 12px" @click="goTemplate"> 定薪模板 </a-button>
                <a-button type="primary" @click="exportRecord">导出</a-button>
              </a-space>
            </div>
          </div>
        </div>

        <!-------------------------------------------- 表格区域区域start -------------------------------------------->
        <a-spin :spinning="spinning" class="xq-form-content">
          <XqTable
            :scroll="{ x: columns.length * 150 }"
            :pagination="false"
            :customize="FormJson['config']['table']['customize']"
            :dataSource="tableData"
            :columns="columns"
            :rowSelection="
              FormJson['config']['table']['extend']['batch']
                ? {
                    selectedRowKeys: selectedRowKeys,
                    onChange: onSelectChange,
                    getCheckboxProps: (record) => ({
                      props: {
                        disabled: record.salarySum !== null, // Column configuration not to be checked
                        name: record.name
                      }
                    })
                  }
                : null
            "
            class="xq-form-content-table"
          >
            <!--------------------------------------------主要内容，表格，自定义 header -------------------------------------------->
            <template v-for="(col, index) in columns" #[`xq_${col.dataIndex}`]>
              <span :key="index">
                {{ col.customTitle }}
              </span>
            </template>
            <!-------------------------------------------- 主要内容，表格，自定义 td -------------------------------------------->
            <template v-for="(col, index) in columns" #[col.dataIndex]="text, record">
              <span v-if="col.dataIndex === 'name'" :key="-index - 1" style="position: relative; cursor: default">
                <img
                  :src="abolitionImg"
                  v-if="record.status === '4'"
                  style="position: absolute; top: -20px; left: -15px; width: 40px; height: 40px"
                />
                <img
                  :src="abolitionImg2"
                  v-if="record.status === '1'"
                  style="position: absolute; top: -20px; left: -15px; width: 40px; height: 40px"
                />
              </span>
              <!-------------------------------------------- 主操作列区域start -------------------------------------------->
              <span v-if="col.dataIndex === 'tableAction'" :key="index">
                <a-row>
                  <span v-if="record.salarySum == null" class="primary" @click="fileAdd(record)">定薪</span>
                  <span v-else>
                    <span class="primary" @click="fileEdit(record)">调薪</span>
                    <a-divider type="vertical" />
                    <span class="primary" @click="fileDetail(record)"> 薪资详情 </span>
                  </span>
                </a-row>
              </span>
              <!-------------------------------------------- 主操作列区域end -------------------------------------------->
              <!-------------------------------------------- 枚举值转换start -------------------------------------------->
              <XqTableCell v-else :key="index" :record="record" :field="FormJson['fields'][col.dataIndex]" :dynamicData="dynamicData" />
              <!-------------------------------------------- 枚举值转换end -------------------------------------------->
            </template>
          </XqTable>
          <!-------------------------------------------- 分页区域start -------------------------------------------->
          <div class="xq-form-content-pagination">
            <div class="xq-form-content-pagination-total">共 {{ total }} 条</div>
            <a-pagination
              v-model="currentPage"
              :page-size="pageSize"
              :total="total"
              :showSizeChanger="true"
              :showQuickJumper="true"
              :pageSizeOptions="['10', '20', '50', '100']"
              :defaultPageSize="10"
              @change="onPageChange"
              @showSizeChange="onPageSizeChange"
            />
          </div>
          <!-------------------------------------------- 分页区域区域end -------------------------------------------->
        </a-spin>

        <a-modal
          v-model="createModalVisible"
          :mask-closable="false"
          :destroy-on-close="true"
          title="新增产品"
          :width="800"
          @cancel="createCancel"
          @ok="createOk"
        >
          <XqFormBuild
            ref="createForm"
            :data-source="{}"
            :dynamic-data="dynamicData"
            :form-fields="FormJson['fields']"
            :form-validators="FormJson['validators']"
            :form-config="FormJson['config']['create']"
          />
        </a-modal>
        <a-modal v-model="effectVisible" :footer="null" :width="350" :closable="false">
          <span>
            该员工已有一条<span style="color: red">未生效调薪记录</span>
            ，你还要继续吗？
          </span>
          <div style="margin-left: 150px; margin-top: 15px">
            <a-button class="mg_r10" @click="handleCancel">查看</a-button>
            <a-button type="primary" @click="handleOk">继续</a-button>
          </div>
        </a-modal>
      </a-tab-pane>
      <a-tab-pane key="2" tab="工价薪资档案" force-render>
        <a-spin :spinning="spinning1">
          <div style="display: flex; justify-content: space-between; align-items: center">
            <div class="operation">
              <a-input-search
                allow-clear
                class="mr12"
                placeholder="姓名/手机号/身份证号"
                style="width: 180px"
                @search="inputChange"
                :defaultValue="nameOrPhone"
              />
              <a-select
                style="width: 180px"
                :append-to-body="false"
                @change="handleChange"
                allowClear
                placeholder="员工状态"
                :defaultValue="empStatus"
              >
                <a-select-option value="1"> 待入职 </a-select-option>
                <a-select-option value="2"> 在职 </a-select-option>
                <a-select-option value="3"> 待离职 </a-select-option>
                <a-select-option value="4"> 离职 </a-select-option>
              </a-select>
              <a-select
                allowClear
                placeholder="请选择渠道"
                @change="selectCheck"
                style="width: 225px; margin-left: 20px"
                :defaultValue="channelId"
              >
                <a-select-option v-model="item.id" v-for="(item, index) in Channels" :key="index">
                  {{ item.name }}
                </a-select-option>
              </a-select>
            </div>
            <div>
              <a-button type="default" @click="isChooseStaff3 = true" style="margin-right: 12px"> 批量编辑规则 </a-button>
              <a-button type="primary" @click="goGongJia">工价规则</a-button>
              <a-button type="primary" style="margin-left: 12px" @click="goLaoWu">招工劳务费规则</a-button>
            </div>
          </div>
          <employee-select
            :show.sync="isChooseStaff3"
            :default-selected-keys="selectedRowKeys5"
            :selected-list.sync="selectedRowKeys5"
            @change="batchEdit(2)"
            :status="7"
          />
          <div class="tableBox">
            <a-table
              :scroll="{ x: 1200 }"
              row-key="id"
              :columns="columns2"
              :data-source="dataList"
              :pagination="pagination"
              @change="handleTableChange"
            >
              <a slot="name" style="position: relative; cursor: default" slot-scope="text, record">
                <img
                  :src="abolitionImg"
                  v-if="record.status === 4"
                  style="position: absolute; top: -16px; left: -15px; width: 40px; height: 40px"
                />
                <img
                  :src="abolitionImg2"
                  v-if="record.status === 1"
                  style="position: absolute; top: -16px; left: -15px; width: 40px; height: 40px"
                />
                <p style="margin-bottom: 0; color: #595959">
                  {{ text }}
                </p>
              </a>
              <span slot="workHour" slot-scope="text, record">
                {{ record.workHour }}
              </span>
              <span slot="salaryRuleName" slot-scope="text, record">
                {{ record.salaryRule ? record.salaryRule.name : "---" }}
              </span>
              <span slot="serviceFeeRuleName" slot-scope="text, record">
                {{ record.serviceFeeRule ? record.serviceFeeRule.name : "---" }}
              </span>
              <span slot="channelName" slot-scope="text">
                {{ text ? text : "---" }}
              </span>
              <a slot="action" slot-scope="text, record" @click="goDetail(record, 2)"> 编辑 </a>
            </a-table>
          </div>
        </a-spin>
      </a-tab-pane>
    </a-tabs>
  </div>
</template>
<script>
import { formatDate } from "@/utils/index";
const columns3 = [
  {
    title: "姓名",
    dataIndex: "name",
    key: "name",
    width: "100px",
    scopedSlots: { customRender: "name" }
  },
  {
    title: "手机号",
    dataIndex: "phone",
    key: "phone",
    width: "100px",
    scopedSlots: { customRender: "phone" }
  },
  {
    title: "身份证号",
    dataIndex: "idCard",
    key: "idCard",
    width: "100px",
    scopedSlots: { customRender: "idCard" }
  },
  {
    title: "渠道",
    dataIndex: "channelVO",
    key: "channelVO",
    width: "150px",
    ellipsis: true,
    scopedSlots: { customRender: "channelVO" }
  },
  {
    title: "入职时间",
    dataIndex: "joinDate",
    key: "joinDate",
    width: "100px",
    scopedSlots: { customRender: "joinDate" }
  },
  {
    title: "工作性质",
    dataIndex: "postType",
    key: "postType",
    width: "100px",
    scopedSlots: { customRender: "postType" }
  },
  {
    title: "操作",
    dataIndex: "action",
    key: "action",
    width: "100px",
    scopedSlots: { customRender: "action" }
  }
];
const columns2 = [
  {
    title: "姓名",
    dataIndex: "name",
    key: "name",
    width: "100px",
    scopedSlots: { customRender: "name" }
  },
  {
    title: "身份证号",
    dataIndex: "idCard",
    key: "idCard",
    width: "200px"
  },
  {
    title: "渠道",
    dataIndex: "channelName",
    key: "channelName",
    width: "150px",
    ellipsis: true,
    scopedSlots: { customRender: "channelName" }
  },
  {
    title: "入职日期",
    dataIndex: "joinDate",
    key: "joinDate",
    width: "150px",
    customRender: (text, record, index) => {
      return formatDate(text);
    },
    scopedSlots: { customRender: "joinDate" }
  },
  {
    title: "累计工时",
    dataIndex: "workHour",
    key: "workHour",
    width: "100px",
    scopedSlots: { customRender: "workHour" }
  },
  {
    title: "出勤天数 ",
    dataIndex: "workDay",
    key: "workDay",
    width: "100px",
    scopedSlots: { customRender: "workDay" }
  },
  {
    title: "工价规则",
    dataIndex: "salaryRuleName",
    key: "salaryGroupName",
    width: "300px",
    scopedSlots: { customRender: "salaryRuleName" },
    ellipsis: true
  },
  {
    title: "招工劳务费规则",
    dataIndex: "serviceFeeRuleName",
    key: "serviceFeeRuleName",
    width: "300px",
    scopedSlots: { customRender: "serviceFeeRuleName" },
    ellipsis: true
  },
  {
    title: "操作",
    dataIndex: "action",
    key: "action",
    width: "70px",
    scopedSlots: { customRender: "action" },
    fixed: "right"
  }
];
import FormJson from "./FormJson";
import qs from "qs";
import axios from "axios";
import XqCurdMixin from "xqjr-plugin-form/mixins/XqCurdMixin";
import ExportMixin from "xqjr-plugin-common/UploadOrExport/exportMixin";
const mixin = new ExportMixin();
import { retrieveReq, createReq, deleteReq, updateReq, selectOutsourceSalary, getAllChannels, getNotList } from "./api";
import { mapState } from "vuex";

const curdMixin = new XqCurdMixin({
  createReq,
  retrieveReq,
  updateReq,
  deleteReq,
  FormJson,
  tableConfigKey: "table"
});

export default {
  components: {
    EmployeeSelect: () => import("@/components/EmployeeSelect2/employeeSelect-xinzi")
  },
  mixins: [curdMixin, mixin],
  data() {
    return {
      selectedRowKeys4: [],
      Channels: [],
      columns3,
      selectedRowKeys: [],
      selectedRowKeys2: [],
      selectedRowKeys3: [],
      abolitionImg: require("@/assets/home/lizhi.png"),
      abolitionImg2: require("@/assets/home/待入职.png"),
      dataList: [],
      notWageList: [],
      columns2,
      nameOrPhone: "",
      nameOrPhone2: "",
      spinning1: false,
      tabsKey: this.$route.query.tabsKey ? this.$route.query.tabsKey : "3",
      effectVisible: false,
      isChooseStaff: false,
      empList: [],
      recordCopy: {},
      channelId: null,
      channelId2: undefined,
      params: {},
      isChooseStaff2: false,
      isChooseStaff3: false,
      selectedRowKeys5: [],
      empStatus: undefined,
      empStatus2: undefined,
      pageSize: 10,
      postTypeCheck: undefined,
      pagination2: {
        pageSize: 10,
        total: 0,
        size: "default",
        current: 1,
        showTotal: (total) => `共 ${total} 条`,
        showQuickJumper: true,
        showSizeChanger: true,
        personalPeriod: null,
        pageSizeOptions: ["10", "20", "50", "100"]
      },
      pagination: {
        pageSize: 10,
        total: 0,
        size: "default",
        current: 1,
        showTotal: (total) => `共 ${total} 条`,
        showQuickJumper: true,
        showSizeChanger: true,
        personalPeriod: null,
        pageSizeOptions: ["10", "20", "50", "100"]
      }
    };
  },
  computed: {
    ...mapState(["hr", "enums"]),
    retrieveParams() {
      return {
        request: {
          companyId: this.hr.companyId,
          "orders[0].property": "gmtCreate",
          "orders[0].desc": true
        }
      };
    },
    createParams() {
      return {};
    },
    dynamicParams() {
      return {
        depNameTree: {
          companyId: this.hr.companyId
        }
      };
    },
    postTypeLst() {
      return this.enums.postTypeLst;
    },
    postTypeArr() {
      return this.enums.postTypeArr;
    }
  },

  created() {
    if (JSON.stringify(this.$getCondition("xzda_condition")) !== "{}") {
      var dparams = JSON.parse(this.$getCondition("xzda_condition"));
      if (dparams.companyId && dparams.companyId === this.hr.companyId) {
        if (this.tabsKey === "3") {
          if (dparams.postType) {
            this.postTypeCheck = dparams.postType;
          }
          if (dparams.nameOrPhone) {
            this.nameOrPhone2 = dparams.nameOrPhone;
          }
          if (dparams.status) {
            this.empStatus2 = dparams.status;
          }
          if (dparams.pageNo2) {
            this.pagination2.current = dparams.pageNo2;
          }
          if (dparams.pageSize2) {
            this.pagination2.pageSize = dparams.pageSize2;
          }
          if (dparams.channelId) {
            this.channelId2 = dparams.channelId;
          }
        }
        if (this.tabsKey === "2") {
          if (dparams.status) {
            this.empStatus = dparams.status;
          }
          if (dparams.pageNo) {
            this.pagination.current = dparams.pageNo;
          }
          if (dparams.pageSize) {
            this.pagination.pageSize = dparams.pageSize;
          }
          if (dparams.nameOrPhone) {
            this.nameOrPhone = dparams.nameOrPhone;
          }
          if (dparams.channelId) {
            this.channelId = dparams.channelId;
          }
        }
      }
    }

    this.getCurrentPage();
    this.dataLists();
    this.getAllChannelsList();
    this.getNotList(); // 查询未定薪列表
  },

  methods: {
    buildDynamicDataCustom(tempDynamicData) {
      this.dynamicData = {
        ...tempDynamicData,
        postTypeLst: this.postTypeLst
      };
    },
    batchEdit(e) {
      var arr = [];
      var nameList = [];
      if (e === 1) {
        this.selectedRowKeys4.forEach((item, index) => {
          arr.push(item.id);
          nameList.push(item.name);
          sessionStorage.setItem("empList", JSON.stringify(arr));
          sessionStorage.setItem("empNameList", JSON.stringify(nameList));
          this.$router.push({
            path: "/wages/file/batchOutsourcing",
            query: {
              selectedRowKeys: JSON.stringify(arr),
              isEdit: true,
              templateId: arr,
              isFixed: true
            }
          });
        });
      } else if (e === 2) {
        this.selectedRowKeys5.forEach((item, index) => {
          arr.push(item.id);
          nameList.push(item.name);
        });
        sessionStorage.setItem("empList", JSON.stringify(arr));
        sessionStorage.setItem("empNameList", JSON.stringify(nameList));
        this.$router.push({
          path: "/wages/file/batchOutsourcing",
          query: {
            selectedRowKeys: JSON.stringify(arr),
            isEdit: true,
            templateId: arr,
            isFixed: false
          }
        });
      }
    },

    filterOption(input, option) {
      return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0;
    },
    goGongJia() {
      this.$router.push("/wages/file/wagesRules");
    },
    goLaoWu() {
      this.$router.push("/wages/file/laborRules");
    },
    getNotList() {
      var par = {
        postType: this.postTypeCheck,
        nameOrPhone: this.nameOrPhone2,
        status: this.empStatus2,
        pageNo: this.pagination2.current,
        pageSize: this.pagination2.pageSize,
        companyId: this.hr.companyId,
        channelId: this.channelId2 ? this.channelId2 : null
      };
      getNotList(par).then((res) => {
        this.notWageList = res.data.entities;
        this.notWageList.forEach((item, index) => {
          if (item.channelVO && item.channelVO.name) {
            item.channelName = item.channelVO.name;
          }
        });
        this.pagination2.total = res.data.entityCount;
        var p = JSON.parse(
          JSON.stringify({
            postType: this.postTypeCheck,
            nameOrPhone: this.nameOrPhone2,
            status: this.empStatus2,
            companyId: this.hr.companyId,
            channelId: this.channelId2 ? this.channelId2 : null,
            pageNo2: this.pagination2.current,
            pageSize2: this.pagination2.pageSize
          })
        );
        p.tabsKey = this.tabsKey;
        this.$setCondition("xzda_condition", JSON.stringify(p));
      });
    },
    onSelectChange2(selectedRowKeys) {
      this.selectedRowKeys2 = selectedRowKeys;
    },
    onSelectChange3(selectedRowKeys) {
      this.selectedRowKeys3 = selectedRowKeys;
      this.empList = selectedRowKeys;
    },
    selectCheck2(e) {
      this.pagination2.current = 1;
      this.pagination2.pageSize = 10;

      this.getNotList();
    },
    selectCheckChannel(e) {
      this.channelId2 = e;
      this.pagination2.current = 1;
      this.pagination2.pageSize = 10;
      this.getNotList();
    },
    selectCheck(e) {
      this.channelId = e;
      this.pagination.current = 1;
      this.pagination.pageSize = 10;
      this.dataLists();
    },
    getAllChannelsList() {
      this.loading = true;
      getAllChannels().then((res) => {
        this.Channels = res.data;
      });
    },
    onSelectChange(selectedRowKeys, e) {
      this.selectedRowKeys = selectedRowKeys;
    },
    handleChange(e) {
      this.pagination.current = 1;
      this.pagination.pageSize = 10;
      this.empStatus = e;
      this.dataLists();
    },
    handleChange2(e) {
      this.pagination2.current = 1;
      this.pagination2.pageSize = 10;
      this.empStatus2 = e;
      this.getNotList();
    },
    tabsChange(e) {
      const query = JSON.parse(JSON.stringify(this.$router.history.current.query)); // 取当前路由query值并且深拷贝
      const path = this.$router.history.current.path; // 取当前路由地址
      query.tabsKey = e; // 修改变动的query值
      this.$router.push({ path, query }); // 改变query值
      if (e === "1") {
        this.$setCondition("xzda_condition", JSON.stringify({}));
      }
    },
    goDetail(record, e) {
      console.log(record);
      this.$router.push({
        path: "/wages/file/outsourcingDetail",
        query: {
          showType: e,
          info: JSON.stringify(record),
          routerData: JSON.stringify({
            formalType: record.formalType,
            empId: record.id,
            name: record.name,
            depName: record.depName,
            positionName: record.positionName,
            joinDate: record.joinDate,
            employType: record.employType,
            postType: record.postType
          }),
          currentPage: this.currentPage
        }
      });
    },
    goDetail2() {
      var arr = [];
      var nameList = [];
      this.selectedRowKeys3.forEach((item, index) => {
        arr.push(item.id);
        nameList.push(item.name);
      });
      sessionStorage.setItem("empList", JSON.stringify(arr));
      sessionStorage.setItem("empNameList", JSON.stringify(nameList));
      this.$router.push({
        path: "/wages/file/batchOutsourcing",
        query: {
          templateId: arr
        }
      });
    },
    // 列表接口
    dataLists() {
      this.spinning1 = true;
      const params = {
        status: this.empStatus,
        pageNo: this.pagination.current,
        pageSize: this.pagination.pageSize,
        companyId: this.hr.companyId,
        nameOrPhone: this.nameOrPhone ? this.nameOrPhone : null,
        channelId: this.channelId ? this.channelId : null
      };
      selectOutsourceSalary(params).then((res) => {
        this.dataList = res.data.entities;
        this.pagination.total = res.data.entityCount;
        this.spinning1 = false;
        var p = JSON.parse(JSON.stringify(params));
        p.tabsKey = this.tabsKey;
        this.$setCondition("xzda_condition", JSON.stringify(p));
      });
    },
    // 搜索事件
    inputChange(value) {
      this.pagination.current = 1;
      this.nameOrPhone = value;
      this.dataLists();
    },
    inputChange2(value) {
      this.pagination2.current = 1;
      this.nameOrPhone2 = value;
      this.getNotList();
    },
    // 分页事件
    handleTableChange(pagination, filters, sorter) {
      this.pagination.current = pagination.current;
      this.pagination.pageSize = pagination.pageSize;
      this.dataLists();
    },
    handleTableChange2(pagination, filters, sorter) {
      this.pagination2.current = pagination.current;
      this.pagination2.pageSize = pagination.pageSize;
      this.getNotList();
    },
    getCurrentPage() {
      if (this.$route.query.currentPage) {
        this.currentPage = parseInt(this.$route.query.currentPage);
      }
    },
    goUpload() {
      this.$router.push({
        path: "/wages/file/upload"
      });
    },
    goTemplate() {
      this.$router.push({
        path: "/wages/file/template"
      });
    },
    tree(array, childKey, onlyLastChild) {
      if (array === null || array.length < 1) {
        return [];
      }
      array.map((item, index) => {
        item["value"] = item.id;
        item["key"] = item.id;
        item["label"] = item.name;
        item["children"] = item[childKey];

        if (item.leave !== 3) {
          item["disabled"] = onlyLastChild;
        }

        if (item.children) {
          this.tree1(item.children, childKey, onlyLastChild);
        }
      });
      return array;
    },
    tree1(array, childKey, onlyLastChild) {
      if (array === null || array.length < 1) {
        return [];
      }
      array.map((item, index) => {
        item["value"] = item.id;
        item["key"] = item.id;
        item["label"] = item.name;
        item["children"] = item[childKey];
        if (item.children) {
          this.tree1(item.children, childKey, onlyLastChild);
        }
      });
      return array;
    },
    batch() {
      this.$router.push({
        path: "/wages/file/batch"
      });
    },
    fileAdd(record) {
      this.$router.push({
        path: "/wages/file/add",
        query: {
          showType: 2,
          routerData: JSON.stringify({
            formalType: record.formalType,
            empId: record.id,
            name: record.name,
            depName: record.depName,
            positionName: record.positionName,
            joinDate: record.joinDate,
            employType: record.employType,
            postType: record.postType
          }),
          currentPage: this.currentPage
        }
      });
    },
    handleOk() {
      this.$router.push({
        path: "/wages/file/edit",
        query: {
          routerData: JSON.stringify({
            formalType: this.recordCopy.formalType,
            empId: this.recordCopy.id,
            name: this.recordCopy.name,
            depName: this.recordCopy.depName,
            positionName: this.recordCopy.positionName,
            joinDate: this.recordCopy.joinDate,
            employType: this.recordCopy.employType,
            postType: this.recordCopy.postType
          })
        }
      });
    },
    handleCancel() {
      this.$router.push({
        path: "/wages/file/detail",
        query: {
          ...this.recordCopy
        }
      });
    },
    fileEdit(record) {
      this.recordCopy = record;
      this.$router.push({
        path: "/wages/file/editDetail",
        query: {
          info: JSON.stringify(record),
          routerData: JSON.stringify({
            formalType: record.formalType,
            empId: record.id,
            name: record.name,
            depName: record.depName,
            positionName: record.positionName,
            joinDate: record.joinDate,
            employType: record.employType,
            postType: record.postType
          }),
          currentPage: this.currentPage
        }
      });
      // }
      // });
    },
    fileDetail(record) {
      this.$router.push({
        path: "/wages/file/detail",
        query: {
          ...record,
          currentPage: this.currentPage
        }
      });
    },
    formatValues(values) {
      return values;
    },
    formatDataSource(record) {
      return record;
    },
    depNameTreeBuilder(data) {
      const tree = this.tree(data, "depChildList", true);
      return tree;
    },
    download(values) {
      const token = this.$store.state.auth.token;
      let params = {};
      params = {
        companyId: this.hr.companyId,
        ...values
      };

      axios({
        url: `/salary/api/v1/fixedSalaryItems/export`,
        params,
        paramsSerializer: (param) => {
          return qs.stringify(param, { indices: false });
        },
        method: "get",
        responseType: "blob",
        headers: {
          token: token
        }
      })
        .then((res) => {
          const link = document.createElement("a");
          const blob = new Blob([res.data], {
            type: "application/vnd.ms-excel"
          });
          link.style.display = "none";
          link.href = URL.createObjectURL(blob);
          link.setAttribute("download", `${this.$store.state.hr.companyName}_` + "员工薪资档案表" + ".xlsx");
          document.body.appendChild(link);
          link.click();
          document.body.removeChild(link);
        })
        .catch((err) => {
          console.log("debug log --> ", err);
        });
    },
    exportRecord() {
      this.$refs["searchForm"]
        .getData()
        .then((values) => {
          this.params = {
            companyId: this.hr.companyId,
            ...values
          };
          this.url = `/salary/api/v1/fixedSalaryItems/export`;
          this.excelName = `${this.$store.state.hr.companyName}_` + "员工薪资档案表" + ".xlsx";
          this.getDownload();
        })
        .catch((err) => {
          console.log("debug log --> ", err);
        });
    }
  }
};
</script>
<style scoped lang="scss">
.ant-table-thead > tr > th,
.ant-table-tbody > tr > td {
  padding: 16px 30px;
}
.operation {
  width: 650px;
  padding: 15px 0;
  display: flex;

  justify-content: space-between;
}
.tableBox {
  margin-top: 10px;
}
</style>
